<template>
  <el-dialog :title="title" :visible.sync="open" width="70%">
    <el-table :data="changeFeeList" border size="mini">
      <el-table-column label="单据号" align="left" prop="costNo" width="100"/>
      <el-table-column label="房屋名称" align="left" width="150" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{scope.row.roomName}}</span>
        </template>
      </el-table-column>
      <el-table-column label="客户" align="left" prop="ownerName" width="100"/>
      <el-table-column label="收费标准" align="left" prop="normNames" width="120"/>
      <el-table-column label="费用期间" align="center" prop="fiscalPeriod" width="80"/>
      <el-table-column label="计费开始日期" align="center" prop="beginTime" width="100">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.beginTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="计费结束日期" align="center" prop="finishTime" width="100">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.finishTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="应收金额" align="center" prop="receivableMoney" width="80" />
      <el-table-column label="修改后的金额" align="center" prop="updateValue" width="120">
        <template slot-scope="scope">
          <el-input style="width: 90px;" v-model="scope.row.updateValue" @change="changeRule(scope.row,scope.$index)" placeholder="应收金额"></el-input>
        </template>
      </el-table-column>
      <el-table-column label="改费原因" align="center" prop="remark" width="220">
        <template slot-scope="scope">
          <el-input v-model="scope.row.remark" placeholder="改费原因"></el-input>
        </template>
      </el-table-column>
    </el-table>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="saveData">保 存</el-button>
      <el-button @click="cancel">取 消</el-button>
    </div>

  </el-dialog>
</template>

<script>
  import { listMixin } from "@/utils/mixins/listMixin";
  import { updateChangeFee } from "@/api/payfee/ruleCost";
  export default {
    name: "changeFee",
    mixins: [listMixin],
    data() {
      return {
        changeFeeList: [],
        open: false,
        title: '修改费用'
      }
    },
    methods: {
      show(option) {
        this.reset()
        this.open = true
        let changeFeeList = JSON.parse(option.ruleCostList)
        changeFeeList.forEach(row=>{
          row['updateValue'] = row.receivableMoney
        })
        this.changeFeeList = changeFeeList
      },
      changeRule(row,index){
        if(!row.updateValue){
          this.msgWarning(`费用单${row.costNo}应收金额不能小于0`)
          this.changeFeeList[index].updateValue = this.changeFeeList[index].receivableMoney
        }else if(!(this.$utils.isInteger(row.updateValue) || this.$utils.isFloat(row.updateValue)) ){
          this.msgWarning(`费用单${row.costNo}修改后的金额不是数字`)
          this.changeFeeList[index].updateValue = this.changeFeeList[index].receivableMoney
        }
      },
      saveData() {
        let updateRuleCosts = []
        this.changeFeeList.forEach(row=>{
          if(row.receivableMoney != row.updateValue){
            updateRuleCosts.push({
              costId: row.costId,
              receivableMoney: row.receivableMoney,
              updateValue: row.updateValue,
              remark: row.remark
            })
          }
        })
        if(updateRuleCosts.length > 0){
          updateChangeFee({changeFeeVos: updateRuleCosts}).then(res=>{
            this.msgSuccess("改费成功！");
            this.$emit("ok")
            this.cancel()
          })
        }else{
          this.msgWarning("没有需要改费的费用单");
        }
      },
      cancel() {
        this.open = false;
        this.reset();
      },
      reset(){
        this.changeFeeList = []
      }
    }
  }
</script>

<style>
</style>
